<template>
  <el-dialog
    v-model="dialogVisible"
    title="商品规格"
    width="50%"
    :before-close="handleClose"
  >
    <div class="seckill-manange-shop-table">
      <el-table
        border
        class="sku-table"
        max-height="500"
        stripe
        :data="tableData"
      >
        <el-table-column prop="goods_spec" label="规格" />
        <el-table-column prop="goods_sku" label="商品sku" />
        <el-table-column label="秒杀价格">
          <template #default="{ row }">
            <el-input
              v-if="goodsInfo.id"
              v-model="row.price_seckill"
              placeholder="输入秒杀价格"
            />
            <span v-else>{{ row.price_seckill }}</span>
          </template>
        </el-table-column>
        <el-table-column label="秒杀库存">
          <template #default="{ row }">
            <el-input
              v-if="goodsInfo.id"
              v-model="row.stock"
              placeholder="输入秒杀库存"
            />
            <span v-else>{{ row.stock }}</span>
          </template>
        </el-table-column>
        <el-table-column label="每人限购">
          <template #default="{ row }">
            <el-input
              v-if="goodsInfo.id"
              v-model="row.max_buy"
              placeholder="每人限购"
            />
            <span v-else>{{ row.max_buy }}</span>
          </template>
        </el-table-column>

        <el-table-column label="状态" align="center">
          <template #default="{ row }">
            <el-select
              v-if="goodsInfo.id"
              style="width: 100%"
              v-model="row.status"
              placeholder="状态"
              clearable
            >
              <el-option label="未开始" :value="0" />
              <el-option label="进行中" :value="1" />
              <el-option label="已结束" :value="2" />
              <el-option label="已关闭" :value="-1" />
            </el-select>
            <div v-else>
              <span v-if="row.status == 0">未开始</span>
              <span v-else-if="row.status == 1">进行中</span>
              <span v-else-if="row.status == 2">已结束</span>
              <span v-else-if="row.status == -1">已关闭</span>
            </div>
          </template>
        </el-table-column>
      </el-table>
    </div>

    <template #footer>
      <span class="dialog-footer">
        <el-button @click="dialogVisible = false">关闭</el-button>
        <el-button v-if="goodsInfo.id" @click="submit" type="primary"
          >提交</el-button
        >
      </span>
    </template>
  </el-dialog>
</template>
<script setup>
import { addApi } from "@/plugins/api/shopping/seckillManage";
let seckillId = inject("seckillGoodsId");
//
let dialogVisible = ref(false);
let tableData = ref([]);

function getData(row) {
  console.log(row);

  console.log(tableData.value);
}

function handleClose(done) {
  // dialogVisible.value = false;
  ElMessageBox.confirm("是否确定关闭此对话框?")
    .then(() => {
      done();
    })
    .catch(() => {
      // catch error
    });
}
let goodsInfo = ref({});
function initFun(type, row) {
  if (type == "add") {
    goodsInfo.value = Object.assign({}, row);
    tableData.value = row.items.map((item) => {
      return item;
    });
  } else {
    goodsInfo.value = {};
    tableData.value = JSON.parse(row.data_items);
  }

  dialogVisible.value = true;
}

const emit = defineEmits(["refreshList"]);
function submit() {
  addApi({
    goods_id: goodsInfo.value.id,
    seckill_id: seckillId.value,
    data_items: tableData.value,
  }).then(() => {
    ElMessage.success("添加成功！");
    emit("refreshList");
    dialogVisible.value = false;
  });
}

onMounted(() => {});
defineExpose({
  initFun,
});
</script>
<style scoped lang="scss">
.seckill-manange-shop {
  .manage-info {
    display: flex;

    .img-box {
      align-self: center;
    }

    .right {
      margin-left: 10px;
      align-self: center;

      span {
        color: #409eff;
      }
    }
  }

  .memo {
    font-size: 12px;
    color: #ff0000;
    margin-bottom: 5px;
  }

  .seckill-manange-shop-table-foot {
    display: flex;
    justify-content: center;
  }
}
</style>
